
import React from 'react';

import isEqual from 'lodash.isequal'

import FormControl from 'bee-form-control';
import 'bee-form-control/build/FormControl.css';

import Button from 'bee-button';
import 'bee-button/build/Button.css';

import Icon from 'bee-icon';
import 'bee-icon/build/Icon.css';

import ReferSingleSelect from './ReferSingleSelect/index.jsx'
import './index.less'
import Loading from '../../../../components/Loading/index.jsx'


class Refer extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            value: '',
            referC: null
        };
        this.dataSource = props.referParams.refPk;
        this[`${this.dataSource}refData`] = {
            ...props.referParams,
            selectedList: [],
            reqData: props.referParams.reqRef.queryCondition(),
            refList: []
        }
    }
    gerReferValue = (key) => {
        let { selectedList } = this[`${this.dataSource}refData`]
        return (selectedList[0] && selectedList[0][key] )|| ""
    }
    componentDidMount() {

    }

    componentWillUnmount() {


    }
    onChange = (value) => {
        this.setState({
            value
        }, () => {
            this.props.confirm &&  this.props.confirm()
        })
    }
    initRefData = (reqData) => {
        this[`${this.dataSource}refData`] = {
            selectedList: [],
            reqData,
            refList: []
        }
    }
    saveRefData = (refData, isChange) => {
        this[`${this.dataSource}refData`] = { ...this[`${this.dataSource}refData`], ...refData }
        let { showRefValue, refType, checkAfter, refPk } = this[`${this.dataSource}refData`]
        console.log('64', refData)
        isChange && this.onChange(refData.selectedList[0][showRefValue])
    }
    onClick = () => {
        let referC = null,
            { refType, reqRef, reqData, } = this[`${this.dataSource}refData`];
        if (!isEqual(reqRef.queryCondition(), reqData)) {
            this.initRefData(reqRef.queryCondition())
        }
        if (refType == "grid") {
            referC = <ReferSingleSelect
                loading={this.Loading}
                saveRefData={this.saveRefData}
                refData={this[`${this.dataSource}refData`]}
                ref={el => { this.ReferSingleSelect = el }}
                {...this.props}
            />
        }
        this.setState({
            referC
        }, () => {
            this.ReferSingleSelect.showGrid()
        })
    }
    render() {
        let { style } = this.props;
        let { value } = this.state;
        // console.log(this.props.search)
        let width = "auto";
        if (style && style.width) {
            width = style.width
        }
        return (
            <div className="ygc-refer" style={{ width }}>
                <FormControl
                    value={this.state.value}
                    style={style}
                    placeholder="项目名称"
                    // onChange={this.onChange}
                />
                <Icon
                    type="uf-navmenu"
                    className='ygc-refer-icon'
                    onClick={this.onClick}
                />
                {value && <Icon className='item-empty-icon' type="uf-close-c-o" onClick={() => {
                    this[`${this.dataSource}refData`] = {
                        ...this.props.referParams,
                        selectedList: [],
                        reqData: this.props.referParams.reqRef.queryCondition(),
                        refList: []
                    }
                    this.onChange("")
                }} />}
                {/* <ReferSingleSelect ref={el => { this.ReferSingleSelect = el }} /> */}
                {
                    this.state.referC
                }
                <Loading ref={el => this.Loading = el} />
            </div>
        )
    }
}


export default Refer;